import { h, resolveDirective, withDirectives } from 'vue';
import { ElTable } from 'element-plus';
import { definePlugin } from '@/components/@comp/create-component';

export default definePlugin({
  name: 'listTable',
  priority: 'CONTENT',
  extendProps: { rowKey: String },
  useMain(instance, props) {
    // console.log(props);
    const { rowKey } = props;

    const { columnNodes } = instance.getPlugin('columnsTransform');

    const { request } = instance.getPlugin('request');

    console.log(request);

    return {
      default: () => {
        return withDirectives(
          h(ElTable, { data: request.data.value.list, stripe: true, rowKey }, () => columnNodes),
          [[resolveDirective('loading'), request.loading.value]],
        );
      },
    };
  },
});
